<template>
  <div class="home">
    <div class="navheaders">
      <van-nav-bar>
        <template #title>
          <span>
            <img src="../../assets/img/logo.png" />
          </span>
        </template>
      </van-nav-bar>
    </div>
    <div class="title">{{this.title}}</div>
    <div class="bar">
      <span class="txt" style="float: left; margin-left: 10px;">发表于：{{this.time}}</span>
      <span class="txt" style="float: right; margin-right: 10px;">浏览量： {{this.hits}}</span>
    </div>
    <div class="content">
      {{this.content}}
    </div>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  data () {
    return {
      title: '',
      time: '',
      hits: '',
      content: ''
    }
  },
  methods: {
    getData () {
      let newsId = this.$route.params.newsId
      axios.get('https://www.zsrencai.cn/zsrencai/api/ms/news/detail/' + newsId).then((res) => {
        let data = res.data.data
        this.title = data.title
        this.time = data.noticeTime
        this.hits = data.hits
        if (data.content) {
          this.content = decodeURI(data.content)
        }

      })
    }
  },
  created () {
    this.getData()
  }
}
</script>

<style>
.title {
  color: #000;
  font-weight: 700;
  margin: 30px auto;
  width: 80%;
}
.bar {
  height: 40px;
  width: 90%;
  background-color: #f7f7f7;
  align-items: center;
  margin: 0 auto;
  border-radius: 10%;
}
.txt {
  line-height: 40px;
  font-size: 20px;
}
.content {
  width: 85%;
  margin: 20px auto;
}
</style>
